<template>
  <div>

    <el-row :gutter="20">
      <el-col :span="6">
        <div class="grid-content bg-purple">
          <el-card class="box-card">
            <div slot="header" class="clearfix">
              <span>用户</span>
            </div>
            <div>
              <p>专家用户：{{data.expertCount}} 普通用户：{{data.generalCount}}</p>
            </div>
          </el-card>
        </div>
      </el-col>
      <el-col :span="6">
        <div class="grid-content bg-purple">
          <el-card class="box-card">
            <div slot="header" class="clearfix">
              <span>素材</span>
            </div>
            <div>
              <p>总计：{{data.mateCount}}</p>
            </div>
          </el-card>
        </div>
      </el-col>
      <el-col :span="6">
        <div class="grid-content bg-purple">
          <el-card class="box-card">
            <div slot="header" class="clearfix">
              <span>已发布</span>
            </div>
            <div>
              <p>总计：{{data.publishedCount}}</p>
            </div>
          </el-card>
        </div>
      </el-col>
      <el-col :span="6">
        <div class="grid-content bg-purple">
          <el-card class="box-card">
            <div slot="header" class="clearfix">
              <span>聊天信息</span>
            </div>
            <div>
              <p>总计：{{data.msgCount}}</p>
            </div>
          </el-card>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import {loadStatisData} from "@/api/admin/user"
export default {
  data() {
    return {
      data:{
        generalCount:'',
        expertCount:'',
        mateCount:'',
        publishedCount:'',
        msgCount:''
      }
    }
  },
  created(){
    this.loadStatis()
  },
  methods:{
    loadStatis(){
      loadStatisData({}, (res) => {
        if(res.code == 200){
          this.data = res.data
        }
      })
    }
  }
}
</script>

<style lang="less" scoped>
</style>